Question

我正在尝试通过WordPress编辑器中的javascript代码向AWS进行身份验证，以将请求发送到AWS Polly。我在互联网上遵循了几个示例，但是我总是会出错。

const CREDS = {
      accessKeyId: "xxx",
      secretAccessKey: "xxx"
      // region: "eu-west-1"
    }; 

  axios(
      aws4.sign(
        {
          host: "polly.eu-west-1.amazonaws.com",
          method: "GET",
          url:
            "https://polly.eu-west-1.amazonaws.com/v1/voices?Engine=neural&IncludeAdditionalLanguageCodes=no&LanguageCode=en-US",
          data: {},
          body: {},
          path:
            "/v1/voices?Engine=neural&IncludeAdditionalLanguageCodes=no&LanguageCode=en-US"
        },
        CREDS
      )
    ).then(res => {
      console.log(res);
      // ...
    });

xhr.js：126拒绝设置不安全的标头“主机” setRequestHeader @ xhr.js：126 forEach @ utils.js：238 dispatchXhrRequest @ xhr.js：120 xhrAdapter @ xhr.js：12 dispatchRequest @ dispatchRequest.js：52 Promise.then（异步）请求@ Axios.js：61包装@ bind.js：9 （匿名）@ edit.js：88 Vh @ react-dom.min.js？ver = 16.9.0：163 Uh @ react-dom.min.js？ver = 16.9.0：14 Xh @ react-dom.min.js？ver = 16.9.0：14 af @ react-dom.min.js？ver = 16.9.0：14是@ @ react-dom.min.js？ver = 16.9.0：164 nd @ react-dom.min.js？ver = 16.9.0：15 nc @ react-dom.min.js？ver = 16.9.0：15 @ @ react-dom.min.js？ver = 16.9.0：38 Ac @ react-dom.min.js？ver = 16.9.0：39 stable_runWithPriority @ react.min.js？ver = 16.9.0：26 Ma @ react-dom.min.js？ver = 16.9.0：52 Be @ react-dom.min.js？ver = 16.9.0：39 xi @ react-dom.min.js？ver = 16.9.0：39 xhr.js：126拒绝设置不安全的标头“ Content-Length” setRequestHeader @ xhr.js：126 forEach @ utils.js：238 dispatchXhrRequest @ xhr.js：120 xhrAdapter @ xhr.js：12 dispatchRequest @ dispatchRequest.js：52 Promise.then（异步）请求@ Axios.js：61 wrap @ bind.js：9（匿名）@ edit.js：88 Vh @ react-dom.min.js？ver = 16.9.0：163 Uh @ react-dom.min.js？ver = 16.9.0：14 Xh @ react-dom.min.js？ver = 16.9.0：14 af @ react-dom.min.js？ver = 16.9.0：14 Yh @ react-dom.min.js？ver = 16.9.0：164 nd @ react-dom.min.js？ver = 16.9.0：15 nc @ react-dom.min.js？ver = 16.9.0：15 @ react-dom.min.js？ver = 16.9.0：38 Ac @ react-dom.min.js？ver = 16.9.0：39 stable_runWithPriority @ react.min.js？ver = 16.9.0：26 Ma @ react-dom.min.js？ver = 16.9.0：52是@ react-dom.min.js？ver = 16.9.0：119 xi @ react-dom.min.js？ver = 16.9.0：39 xhr.js：178 GET https://polly.eu-west-1.amazonaws.com/v1/voices?Engine=neural&IncludeAdditionalLanguageCodes=no&LanguageCode=en-US 403（禁止）

和这个

      aws4.sign(
        {
          service: "polly",
          region: "eu-west-1",
          method: "GET",
          path:
            "/v1/voices?Engine=neural&IncludeAdditionalLanguageCodes=no&LanguageCode=en-US",
          headers: {},
          body: "{}"
        },
        CREDS
      )
    ).then(res => {
      console.log(res);
      // ...
    });

isURLSameOrigin.js：57未捕获（已承诺）TypeError：无法读取未定义的属性“协议” 在isURLSameOrigin（isURLSameOrigin.js：57）在dispatchXhrRequest（xhr.js：109）在新的Promise（）在xhrAdapter（xhr.js：12）在dispatchRequest（dispatchRequest.js：52）

我不明白为什么这么复杂。为什么我做错了？

Answer 1

AWS4令我头疼了好几天！我找到了使用放大的解决方案。它会创建正确的标题

import {Signer} from '@aws-amplify/core';

let request = {         
        method: 'GET',
        url: 'https://polly.eu-west-1.amazonaws.com/v1/voices?Engine=neural&IncludeAdditionalLanguageCodes=no&LanguageCode=en-US',
        data: '' 
    } 
    let access_info = {
        access_key: xxxxx, 
        secret_key: xxxxxx,
        session_token: xxxxx
    }
    let service_info = {
        service: 'polly',
        region: 'eu-west-1'
    }


    //use amplify sign()function to create the signed headers;
    let signedRequest =  Signer.sign(request,access_info,service_info)

    //remove host from header
    delete signedRequest.headers['host']

    //I normally create an instance if I need to intercept my response or request
    var instance = axios.create();


    let response = await instance(signedRequest).then(function (response) {    
       console.log(response);
       return response

     }).catch(function (error) {

         //... handle errors

     });

我希望这可以为您提供帮助

使用axios和aws4向AWS进行身份验证

1 个答案: