Package Exports

laravel-vue-crypto
laravel-vue-crypto/index.min.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (laravel-vue-crypto) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

laravel-vue-crypto

This package integrates laravel's built in encryption service with vue. It enables to encrypt/decrypt API data between laravel back-end and vue front-end. A typical usecase is when using laravel-inertia with axios.

This package requires the APP_KEY in .env passed in while initializing

1. Install

npm i laravel-vue-crypto

2. Setup

Inside app.js

Import the package :

import LaravelVueCrypto from 'laravel-vue-crypto'

Then register it as a vue-global-property

CONST APP_KEY = 'laravel-app-key' // laravel .env's APP_KEY
app.config.globalProperties.$LaravelVueCrypto = new LaravelVueCrypto(APP_KEY)

3. Usage

3.1 Encrypt data

this.$LaravelVueCrypto.encrypt({'id': 1})

encrypt method always returns an object with attribute payload. payload consists the encrypted string.

{payload : 'encrypted-string'}

now in order to decrypt the data from the laravel controller, use laravel's decrypt helper without serialization.

json_decode(decrypt($request, unserialize: false));

3.2 Decrypt data

this.$LaravelVueCrypto.decrypt(encryptedData)

to encrypt data from the laravel controller, use encrypt helper

encrypt(json_encode($dataToEncrypt));

Example

app.js

createInertiaApp({
    setup({ el, App, props, plugin }) {
        const app = createApp({ render: () => h(App, props) })

        app.config.globalProperties.$LaravelVueCrypto = new LaravelVueCrypto(import.meta.env.VITE_APP_KEY)

        app.mount(el);
        return app;
    },
});

.vue file

const dataToEncrypt = {
    'id' : 1,
    'status' : 0
}

try {
    const res = await this.axios.post(
        route("test-route"),
        this.$LaravelVueCrypto.encrypt(dataToEncrypt)
    );

    const decryptedData = this.$LaravelVueCrypto.decrypt(res?.data?.users);
    console.log({ decryptedData });

} catch (err) {
    console.log({ err });
}

laravel controller

 public function handleTestRoute(Request $request){
    $request = json_decode(decrypt($request->payload, unserialize: false));

    // ... 

    $users = User::all();
    $users = encrypt(json_encode($users))

    return response()->json(compact('users'))
}