Package Exports
- odoo-webclient
- odoo-webclient/lib/index.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 (odoo-webclient) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
Odoo-WebClient 📡
Odoo-WebClient 📡 offers a simply but super effective solution that reuse the powerful capability of native Odoo WebClient from outside frontend applications, handly seamless interact with Odoo Services from customize SPA(Single-Page App) or PWA(Progressive Web App), Maximize the value of the services that implemeted by Python🐍 code.
Install
npm install odoo-webclientUsage
- Step 1: Setup client manager, configure the odoo instance address
import { getClientManager, DefaultClientManagerOption } from 'odoo-webclient';
async function setupOdooWebClient() {
const option = new DefaultClientManagerOption()
option.root = 'http://localhost:8069'; // odoo instance address, the instance should install Odoo-site module~
getClientManager().setup(option);
}
setupOdooWebClient();
- Step 2: Hook the webclient mounted event, while the instance WebClient is ready then load data through orm service
getClientManager().mounted((event)=>{
reloadData();
});
function reloadData(){
const webClient = getClientManager().getWebClient();
if (!webClient){
return;
}
fetchApps(webClient)
}
async function fetchApps(webClient) {
console.debug('⚡️ getWebClient', webClient)
const orm = webClient.orm
// http://localhost:8069/web/dataset/call_kw/ir.module.module/web_search_read
const specification = {
icon: {},
icon_flag: {},
to_buy: {},
name: {},
state: {},
summary: {},
website: {},
application: {},
module_type: {},
shortdesc: {},
}
const domain = ['application', '=', true]
const result = await orm.call('ir.module.module', 'web_search_read', [[domain], specification])
console.debug('📡 fetchApps', result)
dataSet.value = result.records
}
- Step 3: Let 🚀, do login then enjoy the smoothly and seamless data access experience.
const user = 'admin'; const password = 'admin'
const clientManager = getClientManager();
const request = await clientManager.login(user,password,true).subscribe(
{
next:x=>{
console.log('login reponse, should includes data.scrpitTags:',x)
}
},
error:(err)=>{
throw err;
});
Example App
APIs
Core class: IClientMananger
export interface IClientMananger {
setup(val: IServerOption): IClientMananger;
login(
login: string,
password: string,
autoLoadClient: boolean
): Observable<ApiResponse>;
logout(): Observable<boolean>;
getWebClient(): IWebClient | null;
loadClient(scriptTags: string): Observable<any>;
mounted(handler: MessageHandler): void;
unmounted(handler: MessageHandler): void;
}
IClientMananger.login
login(login: string, password: string, autoLoadClient: boolean) Observable< ApiResponse >Parameters:
autoLoadClient: Type:boolean, identify whether auto load Odoo WebClicent instance
Login feature. the response contains field: data.scrpitTags, use the string value 'data.scrpitTags' build the HTMLScriptElement
const user = 'admin'; const password = 'admin'
const clientManager = getClientManager();
const request = await clientManager.login(user,password).subscribe(
{
next:x=>{
console.log('login reponse, should includes data.scrpitTags:',x)
}
},
error:(err)=>{
throw err;
});
IClientMananger.mounted
mounted(handler: MessageHandler): void
Listen the Odoo WebClient instance mounted event.
getClientManager().mounted((event)=>{
reloadData();
});
function reloadData(){
const webClient = getClientManager().getWebClient();
if (!webClient){
return;
}
fetchApps(webClient)
}IClientMananger.logout
logout() Observable< ApiResponse >
Logout feature, exist session.
Backend Services Required
- Odoo-Site
Odoo Site expose the Odoo WebClient to Frontend Apps smoothly,seamless reuse the powerful capability of Odoo framework from outside Client Apps . - Odoo
The Odoo framework To Grow Your Business.
Tech Stacks & Dependencies
Mechanism Workflow
Window fetch call RESTful api ----> API response includes script Tags of Odoo WebClient ----> render script Tags <Script>...</Script> on web page ----> load the odoo webclient success----> use js orm service call py🐍 code directly 🚀