CODEWITHSUNDEEP
laravelvue.js
Qais Wardag
Qais Wardag

Reputation: 83

How to hide my Unsplash api key in Laravel

How to hide my Unsplash api key in Laravel

I am making a call from a Vue component but my "Authorization id" api key is visible for everyone as you can see.

How can I hide the API key in Laravel? I am using Laravel 9.

I want to hide the "headers or just the "Authorization".

Hope someone can guide me :))

Unsplash.vue file:

const myAsync = async function fetchUnsplash() {
  const response = await fetch('https://api.unsplash.com', {
    headers: {
      Authorization: 'Client-ID 1234',
    },
  });
};

Upvotes: 0

Views: 264

Answers (1)

Márk Dobó
Márk Dobó

Reputation: 73

I don't know anything about the API that you are using, nor about Laravel, but I assume, you have a fixed string, that you have to send in the HTTP requests.

Because you mentioned you are using Laravel, you have both frontend and backend code.

So in my opinion

  1. you can create a new endpoint in your Laravel REST API: v1/entries
  2. In the PHP code, you have to call the https://api.unsplash.com API, with the secret Client ID.
  3. From the Vue component, you have to send your request to your Laravel API endpoint (example: http(s)://<api-baseurl>/v1/entries).

Upvotes: 1

Related Questions