Как я могу отключить прокси-буфер в проекте vue? - PullRequest
Новая
       31

Как я могу отключить прокси-буфер в проекте vue?

0 голосов
/ 20 декабря 2018

Я занимаюсь разработкой проекта vue, бэкэнд - django.API django вернет StreamHTTPResponse.Я хочу показать ответ, в то время как django выдает некоторые данные.Я не знаю, как настроить прокси-таблицу Vue для архивирования. 

# Create your views here.

from django.http import StreamingHttpResponse, HttpResponse


def stream_response_generator():
    from shelljob import proc
    g = proc.Group()
    p = g.run(["bash", "-c", "nmap baidu.com -sV -vvv"])

    while g.is_pending():
        lines = g.readlines()
        for proc, line in lines:
            yield line


def stream_response(request):
    return StreamingHttpResponse(stream_response_generator())


def index(request):
    return HttpResponse(content="""
    <head><style>
    body {
    background: lightblue;
    }
    </style></head>
<p>Hello

<script>
var xhr = new XMLHttpRequest();
xhr.open('GET', '/tools/test');
xhr.seenBytes = 0;
xhr.onreadystatechange = function() {
  console.log("state change.. state: "+ xhr.readyState);
  if(xhr.readyState == 3) {
    var newData = xhr.response.substr(xhr.seenBytes);
    console.log("newData: <<" +newData+ ">>");
    document.body.innerHTML += "" +newData+ "<br />";
    xhr.seenBytes = xhr.responseText.length;
    console.log("seenBytes: " +xhr.seenBytes);
  }
};
xhr.addEventListener("error", function(e) {
  console.log("error: " +e);
});
console.log(xhr);
xhr.send();
</script>""")

Это представление хорошо работает, когда используется python manage.py runserver и visit / index.Он работает хорошо и показывает вывод подпроцесса построчно.но в vue я создаю такое представление: 

<template>
  <div class="hello">
    <h1>{{ msg }}</h1>
    <h2>Essential Links</h2>
    <ul>
    </ul>
  </div>
</template>

<script>
// const axios = require('axios')
export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  mounted () {
    this.steamIT()
  },
  methods: {
    steamIT: function () {
      var xhr = new XMLHttpRequest()
      xhr.open('GET', '/tools/test')
      xhr.seenBytes = 0
      xhr.onreadystatechange = function () {
        console.log('state change.. state: ' + xhr.readyState)
        if (xhr.readyState === 3) {
          var newData = xhr.response.substr(xhr.seenBytes)
          console.log('newData: <<' + newData + '>>')
          document.body.innerHTML += 'New data: <<' + newData + '>><br />'
          xhr.seenBytes = xhr.responseText.length
          console.log('seenBytes: ' + xhr.seenBytes)
        }
      }
      xhr.addEventListener('error', function (e) {
        console.log('error: ' + e)
      })
      console.log(xhr)
      xhr.send()
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>

в index.js proxyconfig. Я настраиваю прокси так: 

proxyTable: {
  '/tools':{
    target: 'http://127.0.0.1:8000/', # django is run at 127.0.0.1:8000
    headers: {
    },
    selfHandleResponse:true,
    changeOrigin: true
  },
},

, но оно не работает.vue proxy_table вернет все данные после завершения подпроцесса.код Vue, как это.

...