获取 API 模式：no-cors 分配然后函数变量答案

【问题标题】：Fetch API mode: no-cors assign then function variable获取 API 模式：no-cors 分配然后函数变量
【发布时间】：2018-08-27 22:40:49
【问题描述】：

您好，我创建了这个代码块，但我不知道如何分配函数变量。

API 服务器： 192.168.1.109:8085

Nginx 客户端服务器： 192.168.1.137:8086、192.168.1.109:8086

对于 Cors，我的所有设置似乎都是正确的。我认为：/。

主要职责是在使用 fetch 获取数据时验证和捕获数据。即使我成功了，我也无法从屏幕上打印响应数据。请救救我。我是堆栈，今天是我生命中的第 9 天 :(

httpd.conf

Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token"
RewriteEngine On
RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ $1 [R=200,L]
<IfModule mod_headers.c>
Header always set Access-Control-Allow-Credentials true
</IfModule>

用于获取数据的客户端应用程序代码。 device-controller.js

angular
.module('interface', ['loadingStatus'])
.controller('DeviceController', DeviceController)
.config(['$httpProvider', function($httpProvider) {
    //$httpProvider.defaults.withCredentials = true;
    //delete $httpProvider.defaults.headers.common['X-Requested-With'];
}]);

function DeviceController($scope, $http){

$scope.postLogin  = async function (){
    const url = 'http://192.168.1.109:8085/register/login';
    const formData = new FormData();
    formData.append("usrname", "*******");
    formData.append("passwd", "********");

    const config = {
        headers: {
            'content-type': undefined
        },
        method: 'POST',
        //mode: 'cors', // if mode no-cors 
    };

    $http.post(url, formData, config)
        .then(function successCallback(response) {
            console.log(response);
            toastr.success('success');
        }, function errorCallback(response) {
            console.log(response);
            toastr.error('error');
        });
};
$scope.postLogin();


$scope.zwnetGetDesc = async function zwnetGetDesc(){
    await fetch('http://192.168.1.109:8085/cgi/zcgi/networks//zwnet_get_desc', {
        credentials: 'same-origin',
        headers: {
            'user-agent': 'Mozilla/4.0 MDN Example',
            'content-type': 'text/xml'
        },
        method: 'POST',
        mode: 'no-cors'
    })
        .then(blob => blob.text())
        .then(data => {
            console.log(data);
            return data;
        })
        .catch(error => {
            console.log(error);
            return error;
        });
};

$scope.zwnetGetDesc();

};

https://ibb.co/ePchEc [标题截图] https://ibb.co/jnQPSx [xml 响应正文]

要点链接：https://gist.github.com/umutyerebakmaz/073424a4195e75db482ac71e378e4408

【问题讨论】：

我添加了这 2 行凭据：'same-origin'，模式：'no-cors' 我看到从开发人员工具响应和预览选项卡返回的 xml 响应。但不能分配新变量。用于查看操作。

标签： javascript apache cors xmlhttprequest fetch

【解决方案1】：

问题有多个细节。我用自己的才能找到了它，并把它做得更好。

httpd.conf

Header always set Access-Control-Allow-Origin "http://192.168.1.109:8086"    
Header always set Allow-Access-Credential true // outside to if module label.

device.controller.js

$scope.config = {
   withCredentials: true, // add all http.post 
   headers: { 'Content-Type': 'text/plain' } // The content-type parameter I wanted to send to the server did not overlap.
};

在使用海盗船时，请求和响应标头必须完全相同。这条规则是最重要的导致失败的细微差别。

【讨论】：