在Vuejs中使用带有Axios的HTTP基本身份验证时出现401错误

问题描述 投票:1回答:2

我正在开发一个从Apache Solr索引获取数据的Vuejs应用程序,我已经让我的应用程序使用Axios来建立连接。但是,已添加HTTP基本身份验证,我无法使身份验证工作。 Access-Control-Allow-Origin标头在服务器上设置(它在将auth添加到索引之前工作),因此这不是问题。我试图在auth中的配置对象中使用axios.get()对象,如下所示:

const params = new URLSearchParams()
params.append('fl', 'label,bundle,entity_id,ss_language,url,is_product_slideshow')
  if (this.nodeType) {
    params.append('fq', 'bundle:' + this.nodeType)
  } else {
    params.append('fq', 'bundle:' + '(article OR document OR video OR product_display)')
  }
  params.append('fq', 'ss_language:' + this.language)
  params.append('fq', 'bs_status:' + 1)
  params.append('fq', '-is_field_restricted_to_internal_use:1')
  params.append('fq', '-is_field_restricted_to_author_of_as:1')
  params.append('fq', '-is_field_pp_confidential:1')
  params.append('fq', '-is_field_pp_do_not_show_item_on_t:1')
  params.append('q', qs)
  params.append('sort', 'is_sort asc')
  params.append('wt', 'json')
  params.append('rows', 10)
  params.append('start', queryStartRows)
  axios.get('https://my-solr-url.com/solr/my-solr-index/select', {
    params: params,
    withCredentials: true,
    auth: {
      username: 'myusername',
      password: 'mypassword'
    }
  })
  .then(response => {
    this.results = response.data.response.docs
    var numFound = this.numFound = response.data.response.numFound
    // Calculate last page.
    var numFoundRounded = Math.floor(numFound / 10) * 10
    var numPages = numFoundRounded / 10
    this.lastPage = numPages
  })

我可以让查询从Postman运行正常,所以我知道我有正确的凭据。

从我从文档和其他示例中可以看出,我做得对,但我仍然得到401错误。

我也使用Drupal站点中的这个索引,在那里,用户ID和密码作为URL的一部分传递:

https://myusername:[email protected]/solr/my-solr-index/select?...

但这种方法在这里也行不通。我需要做些什么来使身份验证工作?

javascript http authentication axios basic-authentication
2个回答
1
投票

尝试以下代码:

axios({
    method: 'get',
    url: 'https://my-solr-url.com/solr/my-solr-index/select',
    params: params,
    withCredentials: true,
    headers:{Authorization:'Basic '+BASE64ENCODED(USERNAME+':'+PASSWORD)}
})

您必须提供base64编码的用户名+':'+密码才能进行授权并尝试。


0
投票

我遇到了与ExpressJS应用程序描述的问题相同的问题;带有auth: {username: 'user', password: 'pass'}的Axios在浏览器中被来自Axios客户端的401拒绝,但是从Postman获得200 OK。你提到你正在设置Access-Control-Allow-Origin,我能够通过确保在CORS中间件之前执行auth中间件来解决问题。我注意到我的Axios客户端在OPTIONS请求之前发送了一个HTTP GET请求,该请求导致浏览器基于CORS策略阻塞。

对于那些想知道如何根据@Inus的建议手动计算base64编码字符串的人,可以使用btoa() JS方法,但是在浏览器中这仍然给了我401(如预期的那样),因为这相当于Axios计算的授权头时使用auth属性。

© www.soinside.com 2019 - 2024. All rights reserved.